<!DOCTYPE html>
<html>
    
    <head>
        <title>本地储存组件</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width">
        <meta name="descriptions" content="   IE8+及高级浏览器使用localStorage，旧式IE使用userData。这些方法放于avalon.store对象上。">
        <link type="text/css" rel="stylesheet" href="../style/avalon.doc.css">
        <script src="../highlight/shCore.js"></script>
    </head>
    
    <body>
        <div class="wrapper">
            <h2>store</h2>
            <fieldset>
                <legend>本地储存组件</legend>
                <p>IE8+及高级浏览器使用localStorage，旧式IE使用userData。这些方法放于avalon.store对象上。</p>
            </fieldset>
            <h3 class="table-doc-title">使用说明</h3>
            <table class="table-doc" border="1">
                <colgroup>
                    <col width="180">
                        <col width="95">
                            <col width="120">
                </colgroup>
                <tbody>
                    <tr>
                        <th>名字</th>
                        <th>类型</th>
                        <th>默认值</th>
                        <th>说明</th>
                    </tr>
                    <tr>
                        <td align="center" colspan="4">接口方法与固有属性</td>
                    </tr>
                    <tr>
                        <td>set(key,value)</td>
                        <td>Function</td>
                        <td></td>
                        <td>添加或设置某一数据
                            <table border="1">
                                <tbody>
                                    <tr>
                                        <th style="width:100px">参数名/返回值</th>
                                        <th style="width:70px">类型</th>
                                        <th>说明</th>
                                    </tr>
                                    <tr>
                                        <td>name</td>
                                        <td>String</td>
                                        <td></td>
                                    </tr>
                                    <tr>
                                        <td>value</td>
                                        <td>String</td>
                                        <td></td>
                                    </tr>
                                </tbody>
                            </table>
                        </td>
                    </tr>
                    <tr>
                        <td>get(key)</td>
                        <td>Function</td>
                        <td></td>
                        <td>获取某一数据
                            <table border="1">
                                <tbody>
                                    <tr>
                                        <th style="width:100px">参数名/返回值</th>
                                        <th style="width:70px">类型</th>
                                        <th>说明</th>
                                    </tr>
                                    <tr>
                                        <td>name</td>
                                        <td>String</td>
                                        <td></td>
                                    </tr>
                                    <tr>
                                        <td>返回</td>
                                        <td>String</td>
                                        <td></td>
                                    </tr>
                                </tbody>
                            </table>
                        </td>
                    </tr>
                    <tr>
                        <td>remove(key)</td>
                        <td>Function</td>
                        <td></td>
                        <td>移除某一数据
                            <table border="1">
                                <tbody>
                                    <tr>
                                        <th style="width:100px">参数名/返回值</th>
                                        <th style="width:70px">类型</th>
                                        <th>说明</th>
                                    </tr>
                                    <tr>
                                        <td>key</td>
                                        <td>String</td>
                                        <td></td>
                                    </tr>
                                </tbody>
                            </table>
                        </td>
                    </tr>
                    <tr>
                        <td>clear()</td>
                        <td>Function</td>
                        <td></td>
                        <td>清空一数据</td>
                    </tr>
                    <tr>
                        <td>forEach(callback)</td>
                        <td>Function</td>
                        <td></td>
                        <td>遍历所有数据
                            <table border="1">
                                <tbody>
                                    <tr>
                                        <th style="width:100px">参数名/返回值</th>
                                        <th style="width:70px">类型</th>
                                        <th>说明</th>
                                    </tr>
                                    <tr>
                                        <td>callback</td>
                                        <td>Function</td>
                                        <td>里面会依次传入key与value</td>
                                    </tr>
                                </tbody>
                            </table>
                        </td>
                    </tr>
                    <tr>
                        <td>getAll()</td>
                        <td>Function</td>
                        <td></td>
                        <td>得到所有数据，以对象形式返回
                            <table border="1">
                                <tbody>
                                    <tr>
                                        <th style="width:100px">参数名/返回值</th>
                                        <th style="width:70px">类型</th>
                                        <th>说明</th>
                                    </tr>
                                    <tr>
                                        <td>返回</td>
                                        <td>Object</td>
                                        <td></td>
                                    </tr>
                                </tbody>
                            </table>
                        </td>
                    </tr>
                </tbody>
            </table>
            <div class="others">这里提供了一个用cookie实现本地储存的方案 https://developer.mozilla.org/en/DOM/Storage 其他有用的资料
                <ul>
                    <li>
                        <a href="http://www.cnblogs.com/NNUF/archive/2012/06/01/2531436.html">http://www.cnblogs.com/NNUF/archive/2012/06/01/2531436.html</a>
                    </li>
                    <li>
                        <a href="http://www.cnblogs.com/zjcn/archive/2012/07/03/2575026.html">http://www.cnblogs.com/zjcn/archive/2012/07/03/2575026.html</a>
                    </li>
                    <li>
                        <a href="http://dev-test.nemikor.com/web-storage/support-test/">http://dev-test.nemikor.com/web-storage/support-test/</a>
                    </li>
                    <li>
                        <a href="http://arty.name/localstorage.html">http://arty.name/localstorage.html</a>
                    </li>
                </ul>firefox中对file://协议的不支持. 当你在firefox中打开一个本地的html文件的时候,也就是使用file://协议运行一个页面的时候,localStorage是不起作用的.无法设置和获取localStorage.
                其实,本地调试这种方式已经很落后了,至少应该再127.0.0.1的环境中调试吧,这样调试的时候localStorage是工作的,有的人说这是一个firefox的bug.
                但是看到一个解释,我觉得还是挺靠谱的,在file协议中,本来就没有domain的概念,而localStorage是根据domain来生效的.所以从道理上来讲就不应该在file://协议上生效.</div>
            <ul
            class="example-links">
                <li>
                    <a href="avalon.store.ex1.html">例子1</a>
                </li>
                </ul>
        </div>
    </body>

</html>